import * as echarts from 'echarts'

function initChinaCharts()
{
    const dom = document.getElementById("china-map");
    const myChart2= echarts.init(dom);
    let optione;

// myChart.showLoading();
    $.when(
        $.getJSON('http://localhost:8443/playerProvince/getall'),
        $.getJSON('https://geo.datav.aliyun.com/areas_v3/bound/100000_full.json'),

    ).done(function (res0,geoJson) {
        // myChart.hideLoa
        //预处理后端数据
        const data2=[];
        let dimension1=Object.keys(res0[0][0]);
        res0[0].forEach((values,index)=>{
           this.data2.push({name:values[dimension1[7]],value:index+1});
        });
        console.log(data2)
        echarts.registerMap('china',geoJson);
        myChart2.setOption(
            (optione= {
                title: {
                    text: '各届亚运会举办地',
                    subtext:'数据来源:百度百科'
                },
                tooltip: {
                    trigger: 'item',
                    formatter: '{b}<br/>第{c}届'
                },
                toolbox: {
                    show: true,
                    orient: 'vertical',
                    left: 'right',
                    top: 'center',
                    feature: {
                        dataView: {readOnly: false},
                        restore: {},
                        saveAsImage: {}
                    }
                },
                visualMap: {
                    min: 1,
                    max: 18,
                    text: ['High', 'Low'],
                    realtime: false,
                    calculable: true,
                    inRange: {
                        color: ['lightskyblue', 'yellow', 'orangered']
                    }
                },
                series: [
                    {
                        name: '亚州地图',
                        type: 'map',
                        map: 'world',
                        zoom: 1.1,
                        itemStyle: { // 每个区域的样式
                            normal: {
                                areaColor:'#00ffff',
                                borderColor: '#D3D7E1', // 图形的描边颜色
                                borderWidth:0.1 //描边线宽
                            },
                            emphasis: { // 高亮状态
                                areaColor: '#7d7d7d'
                            }
                        },
                        label: {
                            show: false
                        },
                        data:data2,
                    }
                ]
            })
        );
    });

    if (optione && typeof optione === 'object') {
        myChart2.setOption(optione);
    }
    window.addEventListener("resize",()=>{
    myChart2.resize();
});
}
export {
    initChinaCharts
}
